function showOrHide(el: HTMLElement, attr: 'display', value: 'block' | 'none');
function showOrHide(el: HTMLElement, attr: 'opacity', value: number);

function showOrHide(el: HTMLElement, attr: any, value: any) {
  // ...
}

let div2 = document.querySelector('div');
if (div) {
  showOrHide(div, 'display', 'block');
  showOrHide(div, 'opacity', 1);
  // 报错
  // showOrHide(div, 'display', 1);
}

// 例子
interface PlainObject {
  [key: string]: string | number
}

function css1(ele: HTMLElement, attr: PlainObject);
function css1(ele: HTMLElement, attr: string, value: string | number);
function css1(ele: HTMLElement, attr: any, value?: any) {
  if (typeof attr === 'string' && value) {
    ele.style[attr] = value;
  }
  if (typeof attr === 'object') {
    for (let key in attr) {
      ele.style[key] = attr[key];
    }
  }
}

let div22 = document.querySelector('div');
if (div22) {
  css1(div22, 'width', 100);
  css1(div22, {
    'width': 10
  });

  // 如果不使用重载，这里就会有问题了
  // css1(div22, 'width');
}